<template>
  <div id="wrapper">
    <div class="page-category" data-log="商品分类">

      <div class="page-category-wrap">
        <div class="list-wrap" id="m0" v-for="category in categories">
          <h3 class="list_title">{{category.name}}</h3>
          <ol class="list_category">
            <li v-for="child in category.children">

              <div class="img">
                <router-link :to="{name:'List',query:{id:child.id}}">
                <img :src="child.thumb">
                </router-link>
              </div>

              <div class="name"><span>{{child.name}}</span></div>
            </li>

          </ol>
        </div>
      </div>

      <my-footer></my-footer>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
      categories:[]
      }
    },
    created() {
      this.init(); //初始化
    },

    methods: {
      init: function () {
        this.axios.get(`/product/category`)
          .then((response) => {
            // console.log(response.data.categories);
            this.categories = response.data.categories;
          })
      },
    }
  }
</script>
